<!--
 * @Description: 护理单预渲染页面 （文书页面不显示，仅用于获取数据渲染DOM元素的宽、高）
 * @version: 0.1
 * @Author: E-CHOOSEUS R&D
 * @LastEditors: E-CHOOSEUS R&D
-->

<template>
  <div class="icr-preRenderPage">
    <div v-if="columns.length" id="preRenderTable">
      <pre-render-title
        v-for="(column, idx) in columns"
        :key="idx"
        :column="column"
        inline-block
      />
    </div>
    <!-- <div id="preRenderMedicalHistory" class="mt-20">
      <BriefMedicalHistory :docData="docData" />
    </div> -->
    <div v-if="titleTree" id="computedRenderTable">
      <section v-if="titleTree" id="computedRenderHeader">
        <computed-render-title
          v-for="(item, idx) in titleTree.columns"
          :key="idx"
          :column="item"
          inline-block
        />
      </section>
    </div>
    <section v-if="tableList.length" id="preRenderTable-body">
      <pre-render-row
        v-for="(vItem, vIdx) in tableList"
        :key="vIdx"
        :r-data="vItem.rData"
      />
    </section>
  </div>
</template>

<script>
import { defineComponent } from 'vue'

import BriefMedicalHistory from './BriefMedicalHistory.vue'
import ComputedRenderTitle from './computedRenderTitle.vue'
import preRenderRow from './preRenderRow.vue'
import preRenderTitle from './preRenderTitle.vue'

export default defineComponent({
  name: 'IcrPreRenderPage',
  components: {
    preRenderTitle,
    ComputedRenderTitle,
    preRenderRow,
    BriefMedicalHistory
  },
  props: {
    columns: {
      type: Array,
      default: () => []
    },
    titleTree: {
      type: Object,
      default: null
    },
    tableList: {
      type: Array,
      default: () => []
    },
    docData: {
      type: Object,
      default: () => ({})
    },
    activeDate: {
      type: Array,
      default: () => []
    }
  }
})
</script>

<style lang="scss" scoped>
.icr-preRenderPage {
  font-size: 12px;
}

#preRenderTable {
  box-sizing: border-box;
  display: block;
  border-top: 1px solid #000;
  border-left: 1px solid #000;
  white-space: nowrap;
}

#computedRenderHeader {
  box-sizing: border-box;
  display: block;
  margin: 0;
  padding: 0;
  min-width: 100%;
  // border-top: 1px solid #000;
  border-left: 1px solid #000;
  white-space: nowrap;
}

#preRenderTable-body {
  box-sizing: border-box;
  display: block;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.mt-20 {
  margin-top: 20px;
}
</style>
